<template>
  <div>
    <!--<el-row style="margin-bottom: 10px">
      <el-col :span="4" style="margin-left: 30px">
        <span size="mini" type="primary" >登录密码</span>
      </el-col>
      <el-col :span="15" >
        <div class="grid-content bg-purple">
          <el-input size="mini" v-model="passwd"  value="$store.state.edit.row.passwd" @blur="valueCheck" placeholder="密码至少需要填8位,须有字母+数字的组合" ></el-input>
        </div>
      </el-col>
    </el-row>-->
    <el-form
      :model="reviewForm"
      :rules="rules"
      ref="reviewForm"
      size="mini"
      label-width="85px"
      label-position="left"
    >
      <el-form-item prop="passwd" style="margin-left: 80px;" label="登录密码">
        <el-input size="mini" v-model="passwd" style="width: 70%" value="$store.state.edit.row.passwd"  placeholder="密码至少需要填8位,须有字母+数字的组合" ></el-input>
        <el-button size="mini" v-if="!$store.state.edit.row.id" type="success" @click="generateMixed">刷新</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { ajax } from "@/store/yg/common/utils";

export default {
  props: ["data"],
  data() {
    return {
      reviewForm:{},
      passwd: "",
      rules: {
        passwd: [{ required: true, message: "密码至少需要填8位,须有字母+数字的组合", trigger: "blur", validator: this.valueCheck }]
      },
    };
  },
  mounted() {

    if(!this.$store.state.edit.row.id) {
      this.generateMixed();
    } else {
      this.passwd = this.$store.state.edit.row.passwd;
    }
  },
  watch: {
    'passwd': {
      handler(nVal) {
        this.$store.state.edit.row.passwd = nVal;
      }
    }
  },
  methods: {
    generateMixed() {
      if(this.$store.state.edit.row.id) {
        return;
      }
      var chars = ["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z","a","b","c", "d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"];
      var res = "";
      for (var i = 0; i < 4; i++) {
        var id = Math.floor(Math.random() * 52);
        res += chars[id];
      }
      res += Math.floor(Math.random()*1000000);
      this.passwd =  res;
    },
    valueCheck(rule, value, callback) {
      var value = this.passwd;
      console.log("value", value);
      if (!value) {
        return callback(new Error("输入不可以为空"));
      }
      setTimeout(() => {
        if (value == null || value.length < 8) {
          return callback(new Error("密码至少需要填8位"));
        }
        var reg = new RegExp(/^(?![^a-zA-Z]+$)(?!\D+$)/);
        if (reg.test(this.passwd)) {
          callback();
        } else {
          return callback(new Error("须有字母+数字的组合"));
        }
      }, 0);
    },
    /*valueCheck() {
      var value = this.passwd;
      console.log("value", value);
      if (!value) {
        this.$message.error("输入不可以为空")
        return;
      }
      if (value == null || value.length < 8) {
        this.$message.error("密码至少需要填8位")
        return;
      }
      var reg = new RegExp(/^(?![^a-zA-Z]+$)(?!\D+$)/);
      if (!reg.test(this.passwd)) {
        this.$message.error("须有字母+数字的组合")
        return;
      }
    },*/
  }
};
</script>
